<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!-- 引入element-ui样式 -->
    <link rel="stylesheet" href="../../plugins/element-ui/index.css">

</head>
<body  style="background-image: url('../img/hero_bg_1.jpg')">

<div id="app">
    <div style="width: 700px;height: 400px;background-color: #f2e2d0;opacity: 0.9;position: absolute;margin: 150px 0 0 400px;border-radius: 15px">
        <h1 style="line-height: 15px;text-align: center;margin-top: 50px">XXX超市管理系统登录</h1>

        <el-form style="position:absolute;margin:20px 0 0 100px" :model="loginForm" status-icon :rules="rules" ref="loginForm" label-width="100px" class="demo-loginForm">
            <el-form-item label="工号" prop="jobNumber">
                <el-input type="jobNumber" v-model="loginForm.jobNumber" autocomplete="off"></el-input>
            </el-form-item>

            <el-form-item label="密码" prop="password">
                <el-input type="password" v-model="loginForm.password" autocomplete="off"></el-input>
            </el-form-item>

            <div style="margin: 0 0 10px 50px">
                <el-radio v-model="radio" label="1">系统管理员</el-radio>
                <el-radio v-model="radio" label="2">库存管理员</el-radio>
                <el-radio v-model="radio" label="3">销售员</el-radio>
                <el-radio v-model="radio" label="4">采购员</el-radio>
            </div>

            <el-form-item style="margin: 40px 0 0 50px">
                <el-button type="primary" @click="submitForm('loginForm')">登录</el-button>
                <el-button @click="resetForm('loginForm')">重置</el-button>
            </el-form-item>
        </el-form>

    </div>



</div>


<script src="../../plugins/vue/vue.js"></script>

<!-- 引入element-ui组件库 -->
<script src="../../plugins/element-ui/index.js"></script>

<!-- 引入axios -->
<script src="../../plugins/axios/axios.min.js"></script>

<script>
    new Vue({
        el:'#app',    //element
        data:{
            loginForm:{},
            radio: '1',

            //弹框表单（input）校验
            rules: {
                jobNumber: [
                    { required: true, message: '请输入工号', trigger: 'blur' },
                    { min: 3, max: 7, message: '长度在 3 到 7 个字符', trigger: 'blur' }
                ],
                password: [
                    { required: true, message: '请输入密码', trigger: 'blur' },
                    { min: 3, max: 6, message: '长度在 3 到 6 个字符', trigger: 'blur' }
                ],
            },
            //封装操作登录信息的日志表单
            formJournal:{
                jobNumber:'',
                type:'',
                operate:'',
                time:'',
            },

        },
        methods:{
            //提交表单
            submitForm(formName) {
                this.$refs.loginForm.validate((valid)=> {
                    if (valid) {
                        if (this.radio==1){
                            axios.post("/admins/loginAdmin",this.loginForm).then((res)=>{
                                if (res.data.code){

                                    //记录登录日志
                                    this.addJournalLogin(this.loginForm,"系统管理员")

                                    this.$message.success(res.data.msg)

                                    localStorage.setItem('admin',JSON.stringify(res.data))
                                    window.location.href='../admin/Admin.html';
                                }else {
                                    this.$message.error(res.data.msg)
                                    window.location.href='AdminLogin.html';
                                }
                            })
                        }else if (this.radio==2){
                            axios.post("/adminStocks/loginAdminStock",this.loginForm).then((res)=>{
                                if (res.data.code){
                                    //记录登录日志
                                    this.addJournalLogin(this.loginForm,"库存管理员")

                                    this.$message.success(res.data.msg)
                                    localStorage.setItem('adminStock',JSON.stringify(res.data))
                                    window.location.href='../adminStock/AdminStock.html';
                                }else {
                                    this.$message.error(res.data.msg)
                                    window.location.href='AdminLogin.html';
                                }
                            })
                        }else if (this.radio==3){
                            axios.post("/salesmans/loginSalesman",this.loginForm).then((res)=>{
                                if (res.data.code){
                                    //记录登录日志
                                    this.addJournalLogin(this.loginForm,"销售员")

                                    this.$message.success(res.data.msg)
                                    localStorage.setItem('salesman',JSON.stringify(res.data))
                                    window.location.href='../salesman/Salesman.html';
                                }else {
                                    this.$message.error(res.data.msg)
                                    window.location.href='AdminLogin.html';
                                }
                            })
                        }else if (this.radio==4){
                            axios.post("/buyers/loginBuyer",this.loginForm).then((res)=>{
                                if (res.data.code){
                                    //记录登录日志
                                    this.addJournalLogin(this.loginForm,"采购员")

                                    this.$message.success(res.data.msg)
                                    localStorage.setItem('buyer',JSON.stringify(res.data))
                                    window.location.href='../buyer/Buyer.html';
                                }else {
                                    this.$message.error(res.data.msg)
                                    window.location.href='AdminLogin.html';
                                }
                            })
                        }

                    }
                })
            },

            addJournalLogin(row,type){

                console.log("dsds")
                console.log(row.jobNumber)
                console.log(type)

                // 登录——封装日志表单信息
                this.formJournal.jobNumber=row.jobNumber
                this.formJournal.type=type
                this.formJournal.operate="登录"

                //记录登录日志
                axios.post("/journalLogins/addJournalLogin",this.formJournal).then((res)=> {
                })
            },

            //重置表单
            resetForm(formName) {
                this.$refs[formName].resetFields();
            }
        }

    })
</script>
</body>
</html>